Component({
  properties: {
    dropDownMenuTitle: {
      type: Array,
      value: [],
    },
  

    dropDownMenuDdm1Data: {
      type: Array,
      value: []
    },
    dropDownMenuDdm2Data: {
      type: Array,
      value: []
    },
    dropDownMenuDdm3Data: {
      type: Array,
      value: []
    },
    dropDownMenuDdm4Data: {
      type: Array,
      value: []
    },
  },
  data: {

    ddm1_open: false,  // 一级菜单
    ddm2_open: false, // 一级菜单
    ddm3_open: false, // 一级菜单
    ddm4_open: false, // 一级菜单

    shownavindex: '',

    ddm1_style_id: 0,
    ddm1_style_name: '',
    ddm2_style_id: 0,
    ddm2_style_name: '',
    ddm3_style_id: 0,
    ddm3_style_name: '',
    ddm4_style_id: 0,
    ddm4_style_name: '',
  },
  methods: {

   
    tapDdm1Nav: function(e) {
      if (this.data.ddm1_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
          shownavindex: 0
        })
      } else {
        this.setData({
          ddm1_open: true,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
          shownavindex: e.currentTarget.dataset.nav
        })
      }
    },


    tapDdm2Nav: function(e) {
      if (this.data.ddm1_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
          shownavindex: 0
        })
      } else {
        this.setData({
          ddm1_open: false,
          ddm2_open: true,
          ddm3_open: false,
          ddm4_open: false,
          shownavindex: e.currentTarget.dataset.nav
        })
      }
    },

    tapDdm3Nav: function(e) {
      if (this.data.ddm1_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
          shownavindex: 0
        })
      } else {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: true,
          ddm4_open: false,
          shownavindex: e.currentTarget.dataset.nav
        })
      }
    },

    tapDdm4Nav: function(e) {
      if (this.data.ddm1_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
          shownavindex: 0
        })
      } else {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: true,
          shownavindex: e.currentTarget.dataset.nav
        })
      }
    },
    
    



    selectDdm1Item: function(e) {
      var selectedId = e.target.dataset.model.id
      var selectedTitle = e.target.dataset.model.title;
      this.closeHyFilter();
      this.setData({
        selected_ddm1_id: selectedId,
        selected_ddm1_name: selectedTitle
      })
      this.triggerEvent("selectedItem", {
        index: this.data.shownavindex,
        selectedId: selectedId,
        selectedTitle: selectedTitle
      })
    },

    selectDdm2Item: function(e) {
      var selectedId = e.target.dataset.model.id
      var selectedTitle = e.target.dataset.model.title;
      this.closeHyFilter();
      this.setData({
        selected_ddm2_id: selectedId,
        selected_ddm2_name: selectedTitle
      })
      this.triggerEvent("selectedItem", {
        index: this.data.shownavindex,
        selectedId: selectedId,
        selectedTitle: selectedTitle
      })
    },

    selectDdm3Item: function(e) {
      var selectedId = e.target.dataset.model.id
      var selectedTitle = e.target.dataset.model.title;
      this.closeHyFilter();
      this.setData({
        selected_ddm3_id: selectedId,
        selected_ddm3_name: selectedTitle
      })
      this.triggerEvent("selectedItem", {
        index: this.data.shownavindex,
        selectedId: selectedId,
        selectedTitle: selectedTitle
      })
    },

    selectDdm4Item: function(e) {
      var selectedId = e.target.dataset.model.id
      var selectedTitle = e.target.dataset.model.title;
      this.closeHyFilter();
      this.setData({
        selected_ddm4_id: selectedId,
        selected_ddm4_name: selectedTitle
      })
      this.triggerEvent("selectedItem", {
        index: this.data.shownavindex,
        selectedId: selectedId,
        selectedTitle: selectedTitle
      })
    },



    /**关闭筛选 */
    closeHyFilter: function() {
      if (this.data.ddm1_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
        })
      } else if (this.data.ddm2_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
        })
      } else if (this.data.ddm3_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
        })
      }else if (this.data.ddm4_open) {
        this.setData({
          ddm1_open: false,
          ddm2_open: false,
          ddm3_open: false,
          ddm4_open: false,
        })
      }
    },
  },
  //组件生命周期函数，在组件实例进入页面节点树时执行
  attached: function() {


  },

})





/**   JS 数组结构：
  dropDownMenuTitle: ['经营区域', '经营业态', '排序'],
  
    //可展开二级菜单
    data1: [{
        id: 9,
        title: '全部',
        childModel: [{
            id: '10',
            title: '全部'
          }
        ]
      },
      {
        id: 2,
        title: '商业极中心-北馆',
        childModel: [{
            id: '8-1',
            title: '北馆G1'
          },
          {
            id: '8-2',
            title: '北馆F1'
					}
					,
          {
            id: '1-3',
            title: '北馆F2'
          }
        ]
      },
      {
        id: 2,
        title: '商业极中心-南馆',
        childModel: [{
            id: '2-1',
            title: '南馆G1'
          },
          {
            id: '2-2',
            title: '南馆F1'
					}
					,
          {
            id: '2-2',
            title: '南馆F2'
					}
					,
          {
            id: '2-2',
            title: '南馆F3'
          }
        ]
      },
      {
        id: 3,
        title: '绿荫格兰大道步行街区',
        childModel: [{
            id: '3-1',
            title: '步行街G1'
          },
          {
            id: '3-2',
            title: '步行街F1'
          }
        ]
      }
    ],

    //一级菜单
    data2: [
      {
        id: 1,
        title: '全部'
      },
      {
        id: 2,
        title: '餐饮'
      },
      {
        id: 3,
        title: '百货'
			},
      {
        id: 4,
        title: '女装'
      },
      {
        id: 5,
        title: '男装'
      },
      {
        id: 6,
        title: '母婴童装'
      },
      {
        id: 7,
        title: '儿童娱乐'
			}
			,
      {
        id: 8,
        title: '休闲'
			}
			,
      {
        id: 9,
        title: '超市'
      }
    ],
    
    //一级菜单
    data3: [{     
        id: 1,
        title: '默认排序'
      },
      {
        id: 2,
        title: '首字母A-X'
      }
    ],

 

 



 */